﻿<!DOCTYPE html>
<html>
  <head>
    <title>TabBar</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <link href="resources/css/jquery-ui-themes.css" type="text/css" rel="stylesheet"/>
    <link href="resources/css/axure_rp_page.css" type="text/css" rel="stylesheet"/>
    <link href="data/styles.css" type="text/css" rel="stylesheet"/>
    <link href="files/tabbar/styles.css" type="text/css" rel="stylesheet"/>
    <style type="text/css">
@font-face {
font-family:Ionicons;
src:url(https://cdnjs.cloudflare.com/ajax/libs/iview/3.0.1/styles/fonts/ionicons.ttf) format("truetype"),url(https://cdnjs.cloudflare.com/ajax/libs/iview/3.0.1/styles/fonts/ionicons.woff) format("woff"),url(https://cdnjs.cloudflare.com/ajax/libs/iview/3.0.1/styles/fonts/ionicons.svg#Ionicons) format("svg");
font-weight:400;
font-style:normal
}
    </style>
    <script src="resources/scripts/jquery-1.7.1.min.js"></script>
    <script src="resources/scripts/jquery-ui-1.8.10.custom.min.js"></script>
    <script src="resources/scripts/prototypePre.js"></script>
    <script src="data/document.js"></script>
    <script src="resources/scripts/prototypePost.js"></script>
    <script src="files/tabbar/data.js"></script>
    <script type="text/javascript">
      $axure.utils.getTransparentGifPath = function() { return 'resources/images/transparent.gif'; };
      $axure.utils.getOtherPath = function() { return 'resources/Other.html'; };
      $axure.utils.getReloadPath = function() { return 'resources/reload.html'; };
    </script>
  </head>
  <body>
    <div id="base" class="">

      <!-- bg (Rectangle) -->
      <div id="u3693" class="ax_default box_1" data-label="bg">
        <div id="u3693_div" class=""></div>
      </div>

      <!-- Unnamed (NavBar) -->

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u3695" class="ax_default">
        <div id="u3695_state0" class="panel_state" data-label="State1" style="">
          <div id="u3695_state0_content" class="panel_state_content">

            <!-- Unnamed (Rectangle) -->
            <div id="u3696" class="ax_default box_1">
              <div id="u3696_div" class=""></div>
            </div>

            <!-- Unnamed (Group) -->
            <div id="u3697" class="ax_default" data-left="4" data-top="12" data-width="48" data-height="21">

              <!-- Unnamed (Rectangle) -->
              <div id="u3698" class="ax_default label">
                <div id="u3698_div" class=""></div>
                <div id="u3698_text" class="text ">
                  <p><span>返回</span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3699" class="ax_default label">
                <div id="u3699_div" class=""></div>
                <div id="u3699_text" class="text ">
                  <p><span></span></p>
                </div>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3700" class="ax_default label">
              <div id="u3700_div" class=""></div>
              <div id="u3700_text" class="text ">
                <p><span>Button-Tab</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3701" class="ax_default label">
              <div id="u3701_div" class=""></div>
              <div id="u3701_text" class="text ">
                <p><span></span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u3702" class="ax_default">
        <div id="u3702_state0" class="panel_state" data-label="State1" style="">
          <div id="u3702_state0_content" class="panel_state_content">

            <!-- Unnamed (Rectangle) -->
            <div id="u3703" class="ax_default box_1">
              <div id="u3703_div" class=""></div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3704" class="ax_default box_1 selected" selectiongroup="tabar-list-1">
              <img id="u3704_img" class="img " src="images/tabbar/u3704.png"/>
              <div id="u3704_text" class="text ">
                <p style="font-size:24px;line-height:28px;"><span style="font-family:'Ionicons';"></span></p><p style="font-size:12px;line-height:10px;"><span style="font-family:'"Helvetica Neue"', 'Helvetica', '"PingFang SC"', '"Hiragino Sans GB"', '"Microsoft YaHei"', '"微软雅黑"', 'Arial', 'sans-serif';">Wechat</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3705" class="ax_default box_1" selectiongroup="tabar-list-1">
              <img id="u3705_img" class="img " src="images/tabbar/u3704.png"/>
              <div id="u3705_text" class="text ">
                <p style="font-size:24px;line-height:28px;"><span style="font-family:'Ionicons';"></span></p><p style="font-size:12px;line-height:10px;"><span style="font-family:'"Helvetica Neue"', 'Helvetica', '"PingFang SC"', '"Hiragino Sans GB"', '"Microsoft YaHei"', '"微软雅黑"', 'Arial', 'sans-serif';">QQ</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3706" class="ax_default box_1" selectiongroup="tabar-list-1">
              <img id="u3706_img" class="img " src="images/tabbar/u3704.png"/>
              <div id="u3706_text" class="text ">
                <p style="font-size:24px;line-height:28px;"><span style="font-family:'Ionicons';"></span></p><p style="font-size:12px;line-height:10px;"><span style="font-family:'"Helvetica Neue"', 'Helvetica', '"PingFang SC"', '"Hiragino Sans GB"', '"Microsoft YaHei"', '"微软雅黑"', 'Arial', 'sans-serif';">Weibo</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u3707" class="ax_default">
        <div id="u3707_state0" class="panel_state" data-label="State1" style="">
          <div id="u3707_state0_content" class="panel_state_content">

            <!-- Unnamed (Rectangle) -->
            <div id="u3708" class="ax_default box_1">
              <div id="u3708_div" class=""></div>
            </div>

            <!-- Unnamed (Group) -->
            <div id="u3709" class="ax_default" selectiongroup="tabbar-list-2" data-left="0" data-top="0" data-width="94" data-height="53">

              <!-- Unnamed (Rectangle) -->
              <div id="u3710" class="ax_default box_1 selected" selectiongroup="home">
                <img id="u3710_img" class="img " src="images/tabbar/u3710.png"/>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3711" class="ax_default heading_3">
                <div id="u3711_div" class=""></div>
                <div id="u3711_text" class="text ">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3712" class="ax_default label">
                <div id="u3712_div" class=""></div>
                <div id="u3712_text" class="text ">
                  <p><span>One</span></p>
                </div>
              </div>
            </div>

            <!-- Unnamed (Group) -->
            <div id="u3713" class="ax_default" selectiongroup="tabbar-list-2" data-left="94" data-top="0" data-width="94" data-height="53">

              <!-- Unnamed (Rectangle) -->
              <div id="u3714" class="ax_default box_1 selected" selectiongroup="home">
                <img id="u3714_img" class="img " src="images/tabbar/u3710.png"/>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3715" class="ax_default heading_3">
                <div id="u3715_div" class=""></div>
                <div id="u3715_text" class="text ">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3716" class="ax_default label">
                <div id="u3716_div" class=""></div>
                <div id="u3716_text" class="text ">
                  <p><span>Two</span></p>
                </div>
              </div>
            </div>

            <!-- Unnamed (Group) -->
            <div id="u3717" class="ax_default" selectiongroup="tabbar-list-2" data-left="188" data-top="0" data-width="94" data-height="53">

              <!-- Unnamed (Rectangle) -->
              <div id="u3718" class="ax_default box_1 selected" selectiongroup="home">
                <img id="u3718_img" class="img " src="images/tabbar/u3710.png"/>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3719" class="ax_default heading_3">
                <div id="u3719_div" class=""></div>
                <div id="u3719_text" class="text ">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3720" class="ax_default label">
                <div id="u3720_div" class=""></div>
                <div id="u3720_text" class="text ">
                  <p><span>Three</span></p>
                </div>
              </div>
            </div>

            <!-- Unnamed (Group) -->
            <div id="u3721" class="ax_default" selectiongroup="tabbar-list-2" data-left="281" data-top="0" data-width="94" data-height="53">

              <!-- Unnamed (Rectangle) -->
              <div id="u3722" class="ax_default box_1 selected" selectiongroup="home">
                <img id="u3722_img" class="img " src="images/tabbar/u3710.png"/>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3723" class="ax_default heading_3">
                <div id="u3723_div" class=""></div>
                <div id="u3723_text" class="text ">
                  <p><span></span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u3724" class="ax_default label">
                <div id="u3724_div" class=""></div>
                <div id="u3724_text" class="text ">
                  <p><span>Four</span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (Dynamic Panel) -->
      <div id="u3725" class="ax_default">
        <div id="u3725_state0" class="panel_state" data-label="State1" style="">
          <div id="u3725_state0_content" class="panel_state_content">

            <!-- Unnamed (Rectangle) -->
            <div id="u3726" class="ax_default box_1">
              <div id="u3726_div" class=""></div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3727" class="ax_default box_1 selected" selectiongroup="tabar-list-3">
              <img id="u3727_img" class="img " src="images/tabbar/u3727.png"/>
              <div id="u3727_text" class="text ">
                <p><span>Wechat</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3728" class="ax_default box_1" selectiongroup="tabar-list-3">
              <img id="u3728_img" class="img " src="images/tabbar/u3728.png"/>
              <div id="u3728_text" class="text ">
                <p><span>Meaasge</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3729" class="ax_default box_1" selectiongroup="tabar-list-3">
              <img id="u3729_img" class="img " src="images/tabbar/u3727.png"/>
              <div id="u3729_text" class="text ">
                <p><span>Explore</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u3730" class="ax_default box_1" selectiongroup="tabar-list-3">
              <img id="u3730_img" class="img " src="images/tabbar/u3730.png"/>
              <div id="u3730_text" class="text ">
                <p><span>News</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>
